<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.css">

    <link rel="stylesheet" href="./css/productDetails.css">
</head>

<body>
    <!-- 顶部导航栏 -->
    <div class="top-bar">
        <div class="top-box">
            <div class="top-nav-list">
                <a href="" class="text-lnk">帮助中心</a>
                <a href="javascript:;" class="text-lnk">收藏 </a>
                <a href="" class="text-lnk">360官网</a>
                <a href="" class="text-lnk">360智慧生活 </a>
            </div>
            <div class="top-user-box">
                <div class="user-box">
                    <div class="loginAndRegister">
                        <a href="./login.html">登录</a>
                        <a href="./register.html">注册</a>
                    </div>
                    <div class="user-more-list">
                        <a href="" class="user-item user-name jsUserName">机佬_y</a> 
                        <a href="" class="user-item">我的会员 </a>
                        <a href="" class="user-item">我的订单 </a>
                        <a href="" class="user-item">我的优惠券 </a>
                        <a href="" class="user-item">我的收藏 </a>
                        <a href="" class="user-item">我的积分 </a>
                        <a href="" class="user-item">我的预约 </a> 
                        <a href="" class="user-item">收货地址 </a> 
                        <a href="" class="user-item">账号设置 </a> 
                        <a href="javascript:;" class="user-item jsLogout">退出登录 </a>
                    </div>
                </div>
                <div class="cart-box">
                    <a href="./shoppingCart.html" class="text-lnk">
                        <i class="index-icon icon-cart"></i>
                    </a>
                    <div class="cart-detail-box">
                        <a href="" class="text-lnk">
                            <i class="index-icon icon-cart"></i>
                        </a>
                        <div class="js_cart_box">
                            <div class="cart-box-text">
                            您的购物车还没有商品，赶紧去选购吧！
                            </div>
                        </div>
                    </div>
                </div>
            



            </div>
        </div>
    </div>
    <!-- 网页头部 -->
    <div class="head"> 
        <div class="head-box clearfix">
            <div class="logo-box"><a href="./productList.html"></a></div>
            <div class="nav-box">
                <ul>
                    <li><a href="">新品推荐</a></li>
                    <li><a href="">热卖榜单</a></li>
                </ul>
            </div>
            <div class="search-box">
                <div class="search-bar">
                    <input type="text" class="search-ipt">
                    <div class="big-search"></div>
                </div>
                <div class="search-text">
                    <ul>
                        <li>记录仪</li>
                        <li>摄像机</li>
                        <li>路由器</li>
                        <li>耳机</li>
                        <li>扫地机</li>
                        <li>智能手表</li>
                    </ul>
                </div>
            </div>
        </div>

    </div>
    <!-- 网页商品详情区域 -->
    <div class="product-list">
        <div class="prod-intro">
            <div class="sPic fl">
                <div class="middle">
                    <!-- <img src="./images/productDetails/middle01.webp" alt=""> -->
                    <div class="mask"></div>
                    <div class="big">
                        <!-- <img src="./images/productDetails/middle01.webp" alt=""> -->
                    </div>
                </div>
                <div class="small">
                    <!-- <img src="./images/productDetails/middle01.webp" alt="">
                    <img src="./images/productDetails/middle02.webp" alt="">
                    <img src="./images/productDetails/middle03.webp" alt="">
                    <img src="./images/productDetails/middle04.webp" alt="">
                    <img src="./images/productDetails/middle05.webp" alt=""> -->
                </div>
                <div class="feature-box">
                    <ul>
                        <li>
                            <img src="./images/productDetails/feature-box.png" alt="">
                            360商城发货&售后
                        </li>
                        <li>
                            <img src="./images/productDetails/feature-box.png" alt="">
                            满99元包邮
                        </li>
                        <li>
                            <img src="./images/productDetails/feature-box.png" alt="">
                            7天无理由退货
                        </li>
                        <li>
                            <img src="./images/productDetails/feature-box.png" alt="">
                            15天免费换货
                        </li>
                    </ul>
                </div>
            </div>
            <div class="sInfo fr">
                <div class="product-info">
                    <div class="sInfo-title"></div>
                    <div class="sInfo-subtitle">
                        <a href=""><br>更多车品及配件，点击查看&gt;&gt;</a>
                    </div>
                    <div class="sInfo-wrap-content">
                        <div class="row-box sInfo-price">
                            <div class="row-box-label item-label fl">价格</div>
                            <div class="item sInfo-price-normal">
                                <strong class="nowprice"></strong>
                                <i class="oldprice"></i>
                            </div>
                        </div>
                        <div class="row-box sInfo-activity"></div>
                    </div>
                </div>
                <div class="top-notice-bar">物流公告：受疫情影响，部分地区发货时效延滞，上海仓暂缓发货，部分订单时效将受到影响，造成不便敬请谅解。</div>
                <div class="sInfo-wrap">
                    <div class="row-box">
                        <span class="cate-label fl">分类</span>
                        <ul class="cate-list">
                            <li>
                                <a href="">G300 3K</a>
                            </li>
                        </ul>
                    </div>
                    <div class="product-status">
                        <div class="row-box clearfix">
                            <div class="row-box-label fl">数量</div>
                            <div class="row-box-content">
                                <a href="" class="fl">-</a>
                                <input type="text" value="1" class="fl">
                                <a href="" class="fl">+</a>
                            </div>
                        </div>
                        <div class="sInfo-btns">
                            <a href="">立即购买</a>
                            <a href="JavaScript:;" class="cart">加入购物车</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="gInfo">
            <div class="detail-imgs-box-poster">
                <a href="">
                    <img src="./images/productDetails/detail-imgs-box-poster01.jpg" alt="">
                </a>
                <a href="">
                    <img src="./images/productDetails/detail-imgs-box-poster02.jpg" alt="">
                </a>
            </div>
            <div class="gInfo-tab-wrap clearfix">
                <ul>
                    <li style="border:0">
                        <a href="">产品详情</a>
                        <span class="active"></span>
                    </li>
                    <li>
                        <a href="">规格参数</a>
                        <span></span>
                    </li>
                    <li>
                        <a href="">评价（10+）</a>
                        <span></span>
                    </li>
                    <li>
                        <a href="">常见问题</a>
                        <span></span>
                    </li>
                </ul>
                <div class="sInfo-btns fr">
                    <a href="">立即购买</a>
                    <a href="" class="cart">加入购物车</a>
                </div>
            </div>
            <div class="gInfo-content">
                <!-- <p>
                    <img src="./images/productDetails/gInfo-content01.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content02.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content03.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content04.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content05.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content06.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content07.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content08.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content09.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content10.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content11.jpg" alt="">
                </p>
                <p>
                    <img src="./images/productDetails/gInfo-content12.jpg" alt="">
                </p> -->
                <!-- <div style="color:#999;text-align:left;padding:1rem;line-height: 1.6rem;">
                    <h3 style="text-align: center;">价格说明</h3>
                    未划线价：
                    <br>
                    商品的实时标价，具体成交价格根据商品参加活动或使用优惠券、积分等发生变化，最终以订单结算页价格为准。
                    <br>
                    划线价：
                    <br>
                    商品展示的划横线价格为该商品在360商城上曾经展示过的销售价，并非原价。
                    <br>
                    异常问题：
                    <br>商品促销信息以商品详情页“促销”栏中的信息为准；商品的具体售价以订单结算页价格为准；如您发现活动商品售价或促销信息有异常，建议购买前先联系销售商咨询。
                    <br>*此价格说明仅在有价格对比时有效。
                </div> -->
            </div>
        </div>
    </div>
    <!-- 网页商城简介区域 -->
    <div class="helper-floor">
            <div class="footer-box mod-helper clearfix">
                <div class="helper-box about-box">
                    <p class="helper-title">关于商城</p>
                    <p class="helper-text"> 360商城是奇虎360公司的官方电商平台，主要经营360安全智能设备，以及相关领域消费品。提供最新的360智能设备，最贴心的售后服务，360社区一手评测资讯，享受360安全、安心、放心的购物体验。 </p>
                    <div class="follow-box">
                        <span class="follow-btn"> 关于我们 </span>
                        <span class="index-icon icon-weixin"></span>
                        <a href="" class="index-icon icon-weibo"></a>
                    </div>
                </div>
                <div class="helper-box lnk-box">
                    <p class="helper-title">售后服务</p>
                    <a href="" class="helper-text">7日无理由退货 </a>
                    <a href="" class="helper-text">质量问题15日内换货</a>
                    <a href="" class="helper-text">保修条款</a>
                    <a href="" class="helper-text">服务流程</a>
                    <a href="" class="helper-text">许可协议</a>
                    <a href="" class="helper-text">隐私政策</a>
                </div>
                <div class="helper-box lnk-box">
                    <p class="helper-title">帮助中心</p>
                    <a href="" class="helper-text">用户注册</a>
                    <a href="" class="helper-text">会员说明</a>
                    <a href="" class="helper-text">登录与密码找</a>
                    <a href="" class="helper-text">购买指南</a>
                    <a href="" class="helper-text">支付方式</a>
                    <a href="" class="helper-text">配送与说明</a>
                </div>
                 <div class="helper-box contact-box">
                    <p class="helper-title">联系我们</p>
                    <p class="help-text big-text">400-6822-360</p>
                    <p class="help-text small-text">周一至周日 9:00-18:00（仅收市话费）</p>
                </div>
            </div>
    </div>
    <!-- 网页右侧区域 -->
    <div class="mod-right-side">
        <div class="right-middle-box">
            <a href="">
                <i></i>
            </a>
            <a href="">
                <i></i>
            </a>
            <a href="">
                <i></i>
            </a>
        </div>
        <div class="right-bottom-box">
            <a href="">
                <i></i>
            </a>
            <a href="JavaScript:;">
                <i class="totop"></i>
            </a>
        </div>
    </div>
    <!-- 版权区域 -->
    <div class="copyright-floor">
        <div class="footer-box">
            <div class="service-policy-list">
                <a href="" class="policy-item">
                    <i class="index-icon"></i>
                    7天无理由退货 
                </a>
                <a href="" class="policy-item">
                    <i class="index-icon"></i>
                    15天免费换货  
                </a>
                <a href="" class="policy-item">
                    <i class="index-icon"></i>
                    满99元包邮  
                </a>
            </div>
            <div class="copyright-line">
                <p> ©2019-2021 mall.360.cn版权所有 </p>
                <p>
                    <a href="https://beian.miit.gov.cn/" target="_blank">京ICP备08010314号-6</a> <a href="/help/gongshangyingyezhizhao" target="_blank"> 营业执照 </a>
                </p>
                <p style="color:rgba(255,255,255,.5);font-size:12px">
                    公司名称：北京视觉世界科技有限公司 | 社会统一信用代码：91110105336460203N |
                    <a style="color:rgba(255,255,255,.5)" href="/help/shipinjingyingxuke" target="_blank">食品经营许可证</a>
                    <br> 公司地址：北京市朝阳区酒仙桥路6号院2号楼1至17层102号内5层501 | 联系方式：400-6822-360
                </p>
            </div>
        </div>
    </div>
</body>
<script src="../node_modules/jquery/dist/jquery.js"></script>
<script src="../node_modules/layui-layer/dist/layer.js"></script>
<script src="./js/utils.js"></script>
<script src="../node_modules/jquery/dist/jquery.js"></script>
<script src="./js/productDetails.js"></script>
</html>